
export interface IOptions {
  id: string;
  name: string;
  type: string;
  size?: number;
}

interface IPosition {
  left: number;
  top: number;
  width: number;
  height: number;
}

const position: IPosition = {
  left: 0,
  top: 0,
  width: 0,
  height: 0,
};

export function getMatGridSizeClass(size: number): string {
  return `mdc-layout-grid__cell mdc-layout-grid__cell--span-${size}`;
}

/*let onSpaceKeyPress = false
console.log('===========  bind-event  ===============')
document.addEventListener('keydown', (ev) => {
  if (ev.keyCode === 32 || ev.code === 'Space') {
    onSpaceKeyPress = true
  }
})
document.addEventListener('keyup', (ev) => {
  if (ev.keyCode === 32 || ev.code === 'Space') {
    onSpaceKeyPress = false
  }
})
document.addEventListener('keypress', (ev) => {
  if (ev.keyCode === 32 || ev.code === 'Space') {
    onSpaceKeyPress = true
  }
})

const $root = document.querySelector('#root')

function addBackground() {
  if (onSpaceKeyPress) {
    $root.style.background = 'red'
  }
}

function mouseMove (evn) {
  addBackground()
  console.log('mousemove', evn, onSpaceKeyPress)
}

document.addEventListener('mousedown', (evn) => {
  addBackground()
  document.addEventListener('mousemove', mouseMove, false)
})

document.addEventListener('mouseup', (evn) => {
  $root.style.background = ''
  document.removeEventListener('mousemove', mouseMove, false)
})*/


/*function TestComponent ({ children }) {
  console.log(children)
  return (
    <div>
      fdsafdsafdsafsa
      { children.map((Item, index) => {
        if (typeof Item === 'function') {
          return <Item key={index}/>
        } else return Item;
      }) }
    </div>
  )
}*/

/*function TestChildren () {
  return <span>vvvvvvvvvvvvv</span>
}*/